import React from 'react';
import { Tooltip } from 'antd';
//@ts-ignore
import { QuestionCircleOutlined } from '#/utils/antdIcons';
import styles from './index.less';

interface IProps {
  /**
   * 提示语
   */
  hintText?: string;
  /**
   * 全选时显示名称
   */
  title?: string;
}

const ExplainTitle = (props: IProps) => {
  const { hintText = '', title = '' } = props;
  return (
    <div className={styles.container}>
      <div className={styles.title}>{title}</div>
      <Tooltip placement="topLeft" title={hintText} overlayInnerStyle={{ width: 380 }}>
        <div className={styles.hintText}>
          <QuestionCircleOutlined className={styles.hint} />
        </div>
      </Tooltip>
    </div>
  );
};

export default ExplainTitle;
